<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>缩放变形</title>

        <style>

            /* 将transform属性的值设置为scale()，即可实现缩放变形
                        transform: scale（3）;
                                         缩放倍数
                当数值小于1时，表示缩小元素；大于1表示放大元素
            */
            .pic1 {
                transform:scale(1.5);
            }

            .pic2 {
                transform: scale(.66);
            }

            .pic3{
                transform: scale(1);
            }
        </style>
    </head>
    <body>
        <p>
            <img src="gmsb.png" class="pic1">
        </p>
        <p>
            <img src="gmsb.png" class="pic2">
        </p>
        <p>
            <img src="gmsb.png" class="pic3">
        </p>
    </body>
</html>